<template>
  <div class="notice-search">
    <el-input :model-value="keyword" @input="updateKeyword" placeholder="公告标题" />
    <el-select :model-value="type" @change="updateType" placeholder="公告类型">
      <el-option label="全部" value="" />
      <el-option label="系统公告" value="system" />
      <el-option label="考试公告" value="sys_exam" />
    </el-select>
    <el-button type="primary" @click="$emit('search')">查询</el-button>
    <el-button @click="$emit('reset')">重置</el-button>
  </div>
</template>

<script setup lang="ts">
defineProps({
  keyword: { type: String, required: true },
  type: { type: String, required: true }
})

const emit = defineEmits(['update:keyword', 'update:type', 'search', 'reset'])

const updateKeyword = (value: string) => {
  emit('update:keyword', value)
}

const updateType = (value: string) => {
  emit('update:type', value)
}
</script>

<style scoped>
.notice-search {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
}
</style>